<template>
	<view class="content">
		
		<home v-if="tabIdx===1"></home>
		<cate v-if="tabIdx===2"></cate>
		<cart v-if="tabIdx===3"></cart>
		<user v-if="tabIdx===4"></user>
		
		
		<wyg-bottom-tab tabIndex=1 :tabListParent="tabList" @changeTabIdx="_changeTabIdx"></wyg-bottom-tab>
	</view>
</template>

<script> 
    import wygBottomTab from '@/components/wyg-bottom-tab/wyg-bottom-tab.vue';
	
	import TAB_LIST from '../../static/wyg-bottom-tab/js/botoom-list.js';//配置自定义的图标
	import home from '../index/home.vue';
	import cate from '../index/cate.vue';
	import cart from '../index/cart.vue';
	import user from '../index/user.vue';
	export default {
        components:{wygBottomTab,home,cate,cart,user},
		data() {
			return {
				tabList:TAB_LIST,
				tabIdx:1,
			}
		},
		onLoad() {
			
		},
		methods: {
			_changeTabIdx(e){
				this.tabIdx=e;
			}

		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		
	}

</style>
